<template>
	<view class="page">
		<view class="centent">
			<view class="li">
				<view class="lable">
					1.姓名
				</view>
				<view class="">
					<u--input placeholder="请输入..." border="surround" v-model="realName"></u--input>
				</view>
			</view>
			<view class="li">
				<view class="lable">
					2.性别
				</view>
				<view class="dis">
					<view :class="[sex==1 ? 'checked' : '','sex']" @click="change(1)">
						男
					</view>
					<view :class="[sex==2 ? 'checked' : '','sex']" @click="change(2)">
						女
					</view>
				</view>
			</view>
			<view class="li">
				<view class="lable">
					3.学号
				</view>
				<view class="">
					<u--input placeholder="请输入..." border="surround" v-model="studentNum"></u--input>
				</view>
			</view>
			<view class="li">
				<view class="lable">
					4.年级
				</view>
				<view class="">
					<u--input placeholder="请输入..." border="surround" v-model="grade"></u--input>
				</view>
			</view>
			<view class="li">
				<view class="lable">
					5.上传学生证/营业执照 照片认证身份
				</view>
				<view class="dis  aic ">
					<view class="img_box" @click="uploadImg()">
						<image :src="studentImage ? studentImage : '/static/image/add.png'"
							style="width: 100%; height: 100%;" mode="aspectFit"></image>
						<view class="tips">（学生证）</view>
					</view>
					<!-- <view class="img_box" @click="uploadImg(2)">
						<image src="/static/image/add.png" style="width: 100%; height: 100%;" mode="aspectFit"></image>
						<view class="tips">（营业执照）</view>
					</view> -->
				</view>
			</view>

		</view>
		<view class="btn" @click="save">提交</view>
	</view>
</template>

<script>
	import {
		memberUpdate,
		getMemberInfo
	} from '@/api.js'
	export default {
		data() {
			return {
				realName: '',
				sex: null,
				studentNum: '',
				grade: '',
				studentImage: ''
			}
		},
		onShow() {
			this.GetUser()
		},
		methods: {
			async save() {
				let res = await memberUpdate({
					realName: this.realName,
					sex: this.sex,
					studentNum: this.studentNum,
					grade: this.grade,
					studentImage: this.studentImage,
				})
				if (res.code == 200) {
					uni.showToast({
						icon: 'none',
						title: '认证成功'
					})
					setTimeout(() => {
						uni.navigateBack()
					}, 2000)
				}
			},
			// 获取用户信息
			async GetUser() {
				let res = await getMemberInfo()
				this.realName = res.result.realName
				this.sex = res.result.sex
				this.studentNum = res.result.studentNum
				this.grade = res.result.grade
				this.studentImage = res.result.studentImage
				uni.setStorage({
					key: 'userInfo',
					data: JSON.stringify(res.result),
				});

			},
			change(type) {
				if (this.sex == type) {
					this.sex = null
				} else {
					this.sex = type
				}
			},
			uploadImg(type) {
				var that = this

				uni.chooseImage({
					count: 1,
					success: (chooseImageRes) => {
						uni.showLoading({
							title: '加载中',
							mask: true,
						})
						const tempFilePaths = chooseImageRes.tempFilePaths;
						that.cardAddVOS = []
						uni.uploadFile({
							url: 'https://xybl.appldkj.com/api/jeecg-boot/sys/common/upload',
							filePath: tempFilePaths[0],
							name: 'file',
							formData: {},
							success: (uploadFileRes) => {
								uni.hideLoading()
								let msg = JSON.parse(uploadFileRes.data).message
								that.studentImage = msg

							}
						});
					}
				});
			},
		}
	}
</script>

<style scoped lang="scss">
	.btn {
		position: fixed;
		bottom: 60rpx;
		left: 30rpx;
		width: 690rpx;
		height: 90rpx;
		line-height: 90rpx;
		text-align: center;
		background: #FBE43F;
		border-radius: 67rpx 67rpx 67rpx 67rpx;
		font-family: PingFang SC, PingFang SC;
		font-weight: bold;
		font-size: 36rpx;
		color: #FFFFFF;
	}

	.page {
		width: 750rpx;
		padding: 30rpx;
		box-sizing: border-box;

		.centent {
			width: 100%;
			padding: 0 30rpx;
			box-sizing: border-box;

			.li {
				margin-bottom: 40rpx;

				.img_box {
					margin-top: 50rpx;
					width: 190rpx;
					height: 190rpx;


					.tips {
						font-family: PingFang SC, PingFang SC;
						font-weight: 400;
						font-size: 20rpx;
						color: #A2A2A2;
						width: 190rpx;
						text-align: center;
						margin-top: 24rpx;
					}
				}

				.lable {
					font-family: PingFang SC, PingFang SC;
					font-weight: 500;
					font-size: 32rpx;
					color: #000000;
					margin-bottom: 10rpx;
				}

				.sex {
					width: 105rpx;
					height: 85rpx;
					line-height: 85rpx;
					text-align: center;
					border-radius: 12rpx 12rpx 12rpx 12rpx;
					border: 1rpx solid #DFDFDF;
					margin-right: 30rpx;
				}

				.checked {

					background: rgba(#FBE43F, 0.4);
					border: 1rpx solid #FBE43F;
				}
			}
		}
	}
</style>